import type { PlusColumn, FieldValues } from "plus-pro-components";
import type { FormRules } from "element-plus";
import { ref } from "vue";
import { useTable } from "plus-pro-components";
import { findValuePath } from "@/utils/truncate";
import $request from "./request";

// 表单数据
export const formData = ref<FieldValues>();

export const { buttons } = useTable();
export const tableColumns: PlusColumn[] = [
  {
    label: "部门名称",
    minWidth: 200,
    prop: "deptName",
    tableColumnProps: {
      showOverflowTooltip: true
    }
  },
  {
    label: "备注",
    width: 300,
    prop: "remark",
    valueType: "textarea",
    tableColumnProps: {
      showOverflowTooltip: true
    },
    hideInSearch: true
  },
  {
    label: "状态",
    width: 70,
    prop: "status",
    valueType: "select",
    options: [
      {
        label: "显示",
        value: true,
        color: "green"
      },
      {
        label: "隐藏",
        value: false,
        color: "red"
      }
    ]
  }
];

// 按钮
buttons.value = [
  {
    text: "编辑",
    code: "update",
    props: { type: "primary", plain: true }
  },
  {
    text: "新增",
    code: "add",
    props: { type: "success", plain: true }
  },
  {
    text: "删除",
    code: "delete",
    props: { type: "danger", plain: true },
    confirm: {
      title: "系统提示",
      message: ({ row }) => {
        return `确定删除部门“${row.deptName}”与其所有子部门吗？`;
      }
    }
  }
];

// 表单数据转换
export const formDataTransform: FormDataTransform = {
  // 初始化表单数据
  async initForm(options) {
    const parentData = await $request.get.parentsOptions();
    if (options?.id) {
      // 编辑
      const data = await $request.get.detail(options.id as number);
      return {
        ...data,
        parent: findValuePath(parentData, data.parentId)
      };
    } else {
      // 添加
      return {
        parent: options?.type ? findValuePath(parentData, options?.type) : [],
        status: true,
        sort: 99
      };
    }
  },
  // 转化准备提交的表单数据
  transForm(options, formData) {
    const parentId =
      formData.parent.length > 0
        ? formData.parent[formData.parent.length - 1]
        : 0;
    return {
      ...formData,
      parent: undefined,
      parentId
    };
  }
};

// 获取表单信息
export const getFormColumns = (options: FormModalOptions): PlusColumn[] => {
  return [
    {
      label: "上级部门",
      prop: "parent",
      valueType: "cascader",
      fieldProps: {
        placeholder: "顶级部门",
        props: {
          checkStrictly: true
        }
      },
      options: () =>
        $request.get.parentsOptions({
          removes: [options?.id]
        }),
      colProps: { span: 24 }
    },
    {
      label: "部门名称",
      prop: "deptName",
      valueType: "input"
    },
    {
      label: "部门负责人",
      prop: "principal",
      valueType: "input"
    },
    {
      label: "手机号",
      prop: "phone",
      valueType: "input"
    },
    {
      label: "邮箱",
      prop: "email",
      valueType: "input"
    },
    {
      label: "备注",
      prop: "remark",
      valueType: "textarea",
      colProps: { span: 24 }
    },
    {
      label: "状态",
      prop: "status",
      valueType: "radio",
      options: [
        {
          label: "显示",
          value: true
        },
        {
          label: "隐藏",
          value: false
        }
      ]
    },
    {
      label: "排序",
      prop: "sort",
      tooltip: "序号越小排名越靠前",
      valueType: "input-number"
    }
  ];
};

// 验证
export const formRules: FormRules = {
  deptName: [
    {
      required: true,
      message: "请输入部门名称",
      trigger: "blur"
    }
  ]
};
